<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
</head>
<body>
<script src="https://cdn.bootcss.com/vue/2.5.8/vue.js"></script>
<!-- <script src='http://cdn.jsdelivr.net/vue/1.0.26/vue.js'></script> -->
<div id="root">
	<example></example>
</div>	
<script>
Vue.component('example', {
 	template: '<span @click="updateMessage">{{msg}}</span>',
	 data: function () {
		 return {
		 	msg: 'not updated',
		 }
	 },
	 methods: {
		 updateMessage: function () {
		 	this.msg = 'updated';
		 	console.log(this.$el.textContent); // => 'not updated'
			 this.$nextTick(function () {
			 	console.log(this.$el.textContent); // => 'updated'
			 })
		 }
	 }
});
var vm = new Vue({
	el : '#root',
	data : {

	}
})
</script>
</body>
</html>